<%@ page pageEncoding="UTF-8"%>
<%@ page contentType="text/html; charset=UTF-8"%>
<%@taglib prefix="form" uri="http://www.springframework.org/tags/form"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt"%>
<%-- <jsp:include page="admin/common/Userheader.jsp"></jsp:include> --%>
<%
	response.setHeader("Pragma", "No-cache");
	response.setHeader("Cache-Control", "no-cache");
	response.setDateHeader("Expires", 0);
%>
<!DOCTYPE html>
<html lang="zh-CN">

<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="renderer" content="webkit">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- 上述3个meta标签*必须*放在最前面，任何其他内容都*必须*跟随其后！ -->
<title>文件管理系统</title>
<%
	//java判断浏览器版本，防止异步加载js
	String agent = request.getHeader("User-Agent").toLowerCase();
	if (agent.indexOf("msie 8") > -1) {
%>
<script
	src="${pageContext.request.contextPath}/views/js/libs/jquery-1.12.4.js"></script>
<script
	src="${pageContext.request.contextPath}/views/js/html5shiv.min.js"></script>
<script src="${pageContext.request.contextPath}/views/js/respond.min.js"></script>
<%
	} else {
%>
<script
	src="${pageContext.request.contextPath}/views/js/libs/jquery-3.2.1.min.js"></script>
<%
	}
%>
<!-- Bootstrap -->
<link
	href="${pageContext.request.contextPath}/views/css/libs/bootstrap-3.3.7.min.css"
	rel="stylesheet">

<!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
<!--[if lt IE 9]>

    <![endif]-->

<link rel="stylesheet" type="text/css"
	href="${pageContext.request.contextPath}/views/css/home.css">
<script src="${pageContext.request.contextPath}/views/js/utils.js"
	type="text/javascript"></script>
<style type="text/css">
.picBox {
	position: fixed;
	width: 100%;
	height: 100%;
	left: 0;
	top: 0;
	z-index: 10;
	background: rgba(0, 0, 0, .6);
}

.picBox span {
	position: absolute;
	right: 40px;
	top: 60px;
	color: #fff;
	font-size: 20px;
	font-weight: bold;
}

.picBox table {
	width: 90%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 5%;
	z-index: 11;
	text-align: center;
	vertical-align: middle;
}

.picBox table tr td img {
	max-width: 100%;
}

.imgContent p img {
	width: 50px;
	height: 50px;
}

.form-horizontal .form-group {
	margin-right: 0;
	margin-left: 0;
}
</style>

</head>

<body style="overflow: hidden;">
	<!-- 	隐藏值部分 -->
	<div>
		<input type="hidden" id="selDepartId" /> <input type="hidden"
			id="selDepartName" /> <input type="hidden" id="selDepartLevel" />
	</div>
	<!--头部开始-->
	<div class="row">
		<div class="container">
			<div class="header-components">
				<div class="pull-left logo-components"></div>
				<div class="pull-right user_info">
					<%-- 					<c:if test="${ sessionScope.userRole!=0}"> --%>
					<!-- 	                	<div class="pull-left user_manage"> -->
					<!-- 	                        <a href="javascript:;"  onclick="tiaozhuan();">管理人员</a> -->
					<!-- 	                    </div> -->
					<%--                     </c:if> --%>
					<div class="pull-left">
						<div class="user_name">
							<img
								src="${pageContext.request.contextPath}/views/img/ico_branch.png">
							<a class="border_r">${userDepartmentName }</a> <img
								src="${pageContext.request.contextPath}/views/img/user.png">
							<a>${username }(
							<c:if test="${sessionScope.userRole==0}">
								普通用户
							</c:if>
							<c:if test="${sessionScope.userRole==1}">
								部门管理员
							</c:if>
							<c:if test="${sessionScope.userRole==3}">
								超级管理员
							</c:if>
							)</a>
						</div>
					</div>
					<div class="pull-left user_password">
						<a href="#modifyPasswordModal" data-toggle="modal"
							data-target="#modifyPasswordModal">修改密码</a>
					</div>
					<div class="pull-left exit" id="exit">
						<a href="javascript:;">退出</a>
					</div>
				</div>
			</div>
		</div>
	</div>
	<!--内容开始-->
	<div class="row h">
		<div class="container">

			<div class="left_nav">
				<div class="pull-left left-components left_height">
					<!--search-->
					<div class="left-search-component">
						<input id="searchDept" type="text" placeholder="搜索部门" /> <i
							id="left_search_btn"></i>
					</div>
					<!--nav list-->
					<!-- 部门树 -->
					<div id="tree"></div>
				</div>
			</div>
			<iframe id="rightcon" name="rightcon" border="0" style="border: none; width:980px; overflow-x: hidden;" ></iframe>




		</div>
	</div>
	<!-- Include all compiled plugins (below), or include individual files as needed -->
	<script
		src="${pageContext.request.contextPath}/views/js/bootstrap.min.js"></script>
	<!-- deparment tree dependency  bootstrap-treeview.js-->
	<script
		src="${pageContext.request.contextPath}/views/js/libs/bootstrap-treeview.js"></script>
	<script>
		window.onload = window.onresize = window.onscroll = function() {
			auto();
		}
		//计算宽高度
		function auto() {
			var winH = $(window).height(); //获取浏览器的高度
			var headerH = $('.header-components').height();
			$('.left_height').css({
				'height' : winH - headerH,
				"overflow-y" : "auto"
			}); //左侧的高度
			$('iframe').css({
				'height' : winH - headerH
			});

			//处理bootstrap模态框在ie8下水平居中的样式
			var winW = $(window).width();
			$('.modal-dialog').css({
				'width' : '500px',
				'margin-left' : (winW / 2) - 250
			});
		}

		$('#left_search_btn').click(function() {
			var searchContent = $("#searchDept").val();
			if (searchContent != '') {
				searchDept(searchContent);
			}
		})
	</script>
	<!-- 文件下载表单 -->
	<form id="downloadFile"
		action="${pageContext.request.contextPath}/file/downloadfile"
		style="display: none;" method="post">
		<input id="downloadfileId" type="hidden" name="fileId">
	</form>

	<!-- 修改密码 -->
	<!-- 模态框（Modal） -->
	<div class="modal fade" id="modifyPasswordModal" tabindex="-1"
		role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
		<div class="modal-dialog">
			<div class="modal-content">
				<div class="modal-header">
					<button type="button" class="close" data-dismiss="modal"
						aria-hidden="true">&times;</button>
					<h4 class="modal-title" id="myModalLabel">
						<b>修改密码</b>
					</h4>
				</div>
				<div class="modal-body" style="text-align: center">
					<form class="form-horizontal" role="form" style="width: 98%">
						<div class="form-group">
							<label for="newpassword1">新密码</label> <input type="password"
								class="form-control" size="9" id="newpassword1"
								placeholder="请输入密码">
						</div>
						<div class="form-group">
							<label for="newpassword2">确认新密码</label> <input type="password"
								class="form-control" size="9" id="newpassword2"
								placeholder="请输入密码">
						</div>
						<div id="modifysuccess" class="alert alert-success hide"></div>
					</form>
				</div>
				<div class="modal-footer">
					<button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
					<button type="button" class="btn btn-primary"
						onclick="modifyPassword();">提交更改</button>
				</div>
			</div>
		</div>
	</div>
</body>
<script src="${pageContext.request.contextPath}/views/js/jq-confirm.js"></script>
<script type="text/javascript">
	//取消选择的部门nodeId
	var unSelectedId = null;
	//加载部门树
	try {
		$
				.ajax({
					type : 'post',
					url : '${pageContext.request.contextPath}/file/selectdepartmenttree',
					dataType : 'json',
					success : function(rtn) {
						rtnString = JSON.stringify(rtn);
						$('#tree').treeview({
							data : rtnString,
							levels : 2,
							highlightSelected : true,
							backColor : '#f5f8ff'
						});
						bindOnClickEvent();
					},
					error : function() {
						alert('加载失败');
					}
				});
	} catch (e) {
		alert(e);
	}

	//退出弹框
	$('#exit').click(function() {
		confirmTip('确定要退出文件系统吗？', function() {
			logoff();
		})
	})

	//绑定搜索框回车事件
	$("#searchDept").bind('keypress', function(event) {
		if (event.code = 13) {
			if ($("#searchDept").val() != '') {
				searchDept($("#searchDept").val());
			} else {
				clearSearch();
			}
		}
	});

	//绑定部门选择事件
	function bindOnClickEvent() {
		$('#tree')
				.on(
						'nodeSelected',
						function(event, data) {
							$('#selDepartId').val(data.id);
							if (unSelectedId != null
									&& unSelectedId != undefined
									&& unSelectedId != data.nodeId) {
								$('#tree').treeview('unselectNode',
										[ unSelectedId, {
											silent : true
										} ]);
							}
							$('#selDepartName').val(data.text);
							$('#selDepartLevel').val(data.level);
							var rightcon = document.getElementById("rightcon");
							rightcon.contentWindow.location.href = encodeURI('index_rightonepage?selDepartId='
									+ data.id + "&selDepartName=/" + data.text);
							//2017年8月16日16:56:59 wangruwei 这个是原先的 带分页的，只是只有文件排序
							//			rightcon.contentWindow.location.href=encodeURI('index_right?selDepartId='+data.id+"&selDepartName=/"+data.text);
							//alert(data.text + ':' + data.id);
							//alert('当节点被选择时触发' + data.id + '可在此加入自己的处理逻辑');
						});

		//取消选择时触发
		$('#tree').on('nodeUnselected', function(event, data) {
			unSelectedId = data.nodeId;
			$('#tree').treeview('selectNode', [ data.nodeId, {
				silent : true
			} ]);
			var rightcon = document.getElementById("rightcon");
			rightcon.contentWindow.location.href = encodeURI('index_rightonepage?selDepartId='
					+ data.id + "&selDepartName=/" + data.text);
		});

		//
		$('#tree').on('nodeExpanded', function(event, data) {
			//alert(data.text + ':' + data.id);
			//alert('当节点前+号被选择扩展时触发' + data.id + '可在此加入自己的处理逻辑');
		});
		$('#tree').on('nodeCollapsed', function(event, data) {
			//alert(data.text + ':' + data.id);
			//alert('当节点前+号被选择收缩时触发' + data.id + '可在此加入自己的处理逻辑');
		});
		$('#tree')
				.on(
						'searchComplete',
						function(event, result) {
							if (autoSelectDept == true) {
								try {
									if (result != null && result != undefined) {
										var index = 0;
										while (index <= 10) {//最多找10次
											try {
												if (result[index] != undefined) {
													if (departmentId == result[index].id) {
														var nodeId = result[index].nodeId;
														clearSearch();
														$('#tree')
																.treeview(
																		'selectNode',
																		[
																				nodeId,
																				{
																					silent : true
																				} ]);
														break;
													}
												}
											} catch (e) {

											}
											index++;
										}
									}
								} catch (e) {
									alert('自动选择当前部门失败');
								}
								//该方法执行完毕一次后关闭自动选择部门
								autoSelectDept = false;
							}
							if (result != null && result != undefined
									&& result[0] != null
									&& result[0] != undefined) {
								//自动查询搜索后的第一个部门
								var departId = result[0].id;
								var departName = result[0].text;
								var nodeId = result[0].nodeId;
								$('#selDepartId').val(departId);
								$('#selDepartName').val(departName);
								$('#selDepartLevel').val(result[0].level);
								var rightcon = document
										.getElementById("rightcon");
								rightcon.contentWindow.location.href = encodeURI('index_rightonepage?selDepartId='
										+ departId
										+ "&selDepartName=/"
										+ departName);
								//rightcon.contentWindow.location.href=encodeURI('index_right?selDepartId='+departId+"&selDepartName=/"+departName);
								//选中搜索后的第一个部门
								$('#tree').treeview('selectNode', [ nodeId, {
									silent : true
								} ]);
							}
							//alert(data.text + ':' + data.id);
							//alert('当节点前+号被选择收缩时触发' + data.id + '可在此加入自己的处理逻辑');
						});
	}

	//搜索部门函数
	function searchDept(searchName) {
		$('#tree').treeview('search', [ searchName, {
			ignoreCase : true, // case insensitive 
			exactMatch : false, // like or equals 
			revealResults : true, // reveal matching nodes 
		} ]);
	}

	//清理搜索结果
	function clearSearch() {
		$('#tree').treeview('clearSearch');
	}

	//下载文件
	function downloadFile(fileId) {
		$("#downloadfileId").val(fileId);
		$("#downloadFile").submit();
	}
	//删除文件
	function batchDeleteFiles() {
		var fileIds = '';
		$("input[name='fileId']:checked").each(function() {
			fileIds += $(this).val() + ',';
		});
		if (fileIds == "") {
			alert(" 请选择要删除的数据!");
			return;
		}
		$.ajax({
			type : 'post',
			url : '${pageContext.request.contextPath}/file/deletefiles',
			dataType : 'json',
			data : {
				'fileIds' : fileIds
			},
			success : function(rtn) {
				if (rtn.code == 0) {
					alert('删除成功');
				} else {
					alert(rtn.msg);
				}
			},
			error : function() {
				alert('请求异常');
			}
		});
	}
	//修改密码
	function modifyPassword() {
		var newpassword1 = $("#newpassword1").val();
		if (newpassword1 == '') {
			$("#modifysuccess").attr("class", "alert alert-warning");
			$("#modifysuccess").html('请输入密码');
			$("#newpassword1").focus();
			return;
		}
		var reg = /^[0-9a-zA-Z]+$/;
		if (!reg.test(newpassword1)) {
			$("#modifysuccess").attr("class", "alert alert-warning");
			$("#modifysuccess").html('密码只能由数字和字母组成');
			$("#newpassword1").focus();
			return;
		}
		if (newpassword1.length < 6) {
			$("#modifysuccess").attr("class", "alert alert-warning");
			$("#modifysuccess").html('密码长度不能少于6位');
			$("#newpassword1").focus();
			return;
		}
		if (newpassword1.length > 12) {
			$("#modifysuccess").attr("class", "alert alert-warning");
			$("#modifysuccess").html('密码长度不能大于12位');
			$("#newpassword1").focus();
			return;
		}
		var newpassword2 = $("#newpassword2").val();
		if (newpassword2 == '') {
			$("#modifysuccess").attr("class", "alert alert-warning");
			$("#modifysuccess").html('请输入确认密码');
			$("#newpassword2").focus();
			return;
		}
		if (newpassword1 != newpassword2) {
			$("#modifysuccess").attr("class", "alert alert-warning");
			$("#modifysuccess").html('两次输入密码不一致');
			return;
		}
		$
				.ajax({
					type : 'post',
					url : '${pageContext.request.contextPath}/login/modifypassword',
					dataType : 'json',
					data : {
						newpassword : newpassword1
					},
					success : function(rtn) {
						if (rtn.code == 0) {
							$("#modifysuccess").attr("class",
									"alert alert-success");
							$("#modifysuccess").html("修改成功！2s后自动关闭...");
							/* $('#modifyPasswordModal').modal('hide'); */
							setTimeout(function() {
								$("#modifyPasswordModal").modal("hide")
							}, 2000);
						} else {
							$("#modifysuccess").attr("class",
									"alert alert-warning");
							$("#modifysuccess").html("失败！" + rtn.msg);
						}
					},
					error : function(XMLHttpRequest, textStatus, errorThrown) {
						if (XMLHttpRequest.status == '405') {
							//登录超时跳转
							parent.window.location.href = '${pageContext.request.contextPath}/login/login';
						}
						//alert('请求出错');
					}
				});
	}
	//修改密码模态窗口显示加载监听
	$('#modifyPasswordModal').bind('show.bs.modal', function() {
		//清空之前的密码
		$("#newpassword1").val('');
		$("#newpassword2").val('');
		//还原提示框
		$("#modifysuccess").attr("class", "alert alert-success hide");
		$("#modifysuccess").html("");
	});

	//右侧加载数据 
	//打开修改密码模态窗口
	function openModifyPasswordModal() {
		$('#modifyPasswordModal').modal('show');

	}
	var departmentId = '${departmentId}';
	var userDepartmentName = '${userDepartmentName}';
	var departmentLevel = '${departmentLevel}';
	var autoSelectDept = true;
	function autoLoad() {
		$('#selDepartId').val(departmentId);
		$('#selDepartName').val(userDepartmentName);
		$('#"selDepartLevel"').val(departmentLevel);
		var rightcon = document.getElementById("rightcon");
		rightcon.contentWindow.location.href = encodeURI('index_rightonepage?selDepartId='
				+ departmentId + "&selDepartName=/" + userDepartmentName);
		//rightcon.contentWindow.location.href=encodeURI('index_right?selDepartId='+departmentId+"&selDepartName=/"+userDepartmentName);

	}
	//退出
	function logoff() {
		$.ajax({
			type : "post",
			url : "${pageContext.request.contextPath}/login/logoff",
			data : {},
			dataType : "json",
			success : function(data) {
				if (data.code == 0) {
					window.location.href = '${pageContext.request.contextPath}'
							+ data.data;
				}

			},
			error : function() {
				alert("网络错误！");
			}
		});

	}
	//监听部门搜索输入变化
	$("#searchDept").on('input propertychange', function() {
		var result = $(this).val();
		//搜索部门
		searchDept(result);
	});
	//autoLoad();
	$(function() {
		//自动选择用户当前部门
		setTimeout(function() {
			searchDept(userDepartmentName)
		}, 1000);
	});

	function reSizePic(src) {
		//src = "https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1503046393592&di=f8cb9350647f2e14b755c731a98f588d&imgtype=0&src=http%3A%2F%2Ftupian.enterdesk.com%2F2015%2Fxu%2F04%2F17%2F2%2F7.jpg";
		//src = "https://ss0.bdstatic.com/5aV1bjqh_Q23odCf/static/superman/img/logo/bd_logo1_31bdc765.png";
		var divPic = document.createElement("div");
		divPic.className = 'picBox'
		divPic.innerHTML = "<div class='picBox_mask'></div><span class='close'>X</span><table border='0' cellspacing='0' cellpadding='0'><tr><td align='center' valign='middle'><img src="+src+" /></td></tr></table>";
		document.body.appendChild(divPic);
		var w = $('.center_pic img').width();
		var h = $('.center_pic img').height();
		$('.center_pic').css({
			"marginLeft" : "-(w/2)",
			"marginTop" : "-(h/2)"
		});
		$('.close').click(function() {
			$('.picBox').css({
				'display' : 'none'
			})
			/* divPic.remove(); */
		})
	}

	function tiaozhuan() {
		var rightcon = document.getElementById("rightcon");

		var selDepartId = $("#selDepartId").val();
		var selDepartLevel = $("#selDepartLevel").val();
		rightcon.contentWindow.location.href = encodeURI('${pageContext.request.contextPath}/user/usermanage?selDepartId='
				+ selDepartId + '&selDepartLevel=' + selDepartLevel);
	}
</script>
</html>